<template>
	<body>
		<div id="app" data-v-app="">
			<div class="common-layout" data-v-9a867d3b="">

				<div class="main-container" data-v-9a867d3b="">
					<div class="container" data-v-9a867d3b="" style="margin-top:0px;">
						<div class="wrapper" data-v-2be690e6="">
							<div class="main-contain" data-v-2be690e6="">

								<div class="search-condition" data-v-2be690e6="">
									<div data-v-2be690e6="" style="width: 880px;">
										<div class="detailHeader" data-v-2be690e6="">
											<div class="detailHeader__header" data-v-2be690e6="">
												<div class="detailHeader__img" data-v-2be690e6="">
													<div class="el-image" data-v-2be690e6=""><img :src="listData.F_Icon"
															class="el-image__inner" style="object-fit: fill;">
														<!--v-if-->
														<!--v-if-->
													</div>
												</div>
												<div class="detailHeader__overview clearfix" data-v-2be690e6="">
													<div class="detailHeader__text" data-v-2be690e6="">
														<div class="detailHeader__title" data-v-2be690e6="">
															<h1 class="detailHeader__titleText" data-v-2be690e6=""
																style="font-size: 16px;">
																{{listData.F_Name}}<span class="version"
																	data-v-2be690e6=""
																	style="font-size: 16px;">{{listData.F_Versions}}</span>
															</h1>
														</div>
														<div class="tags" data-v-2be690e6="" style="margin-top: 0px;">
															<div class="tag" data-v-2be690e6="">{{listData.F_Type}}
															</div>
															<div class="tag" data-v-2be690e6="">{{listData.F_DeliveryMethod}}</div>
														</div>
														<p class="detailHeader__digest" data-v-2be690e6="">
															{{listData.F_Name}}</p>
													</div>
													<div class="detailHeader__priceContainer" data-v-2be690e6="">
														<div class="detailPrice__card" data-v-2be690e6="">
															<div class="detailPrice__package" data-v-2be690e6="">
																<div class="detailPrice__pricePart" data-v-2be690e6="">
																	<div data-v-2be690e6=""><label
																			data-v-2be690e6="">现价：</label><span
																			data-v-2be690e6=""><span
																				data-v-2be690e6=""><span
																					class="detailPrice__priceCny"
																					data-v-2be690e6="">￥</span><span
																					class="detailPrice__priceNum"
																					data-v-2be690e6="">{{listData.F_BottomPrice}}</span></span><span
																				class="detailPrice__priceUnit"
																				data-v-2be690e6="">元/月</span></span>
																	</div>
																	<div class="average" data-v-4f3f1118=""
																		data-v-2be690e6=""><span class="unit"
																			data-v-4f3f1118="">综合评分</span><span
																			class="score" data-v-4f3f1118="">暂无评分</span>
																	</div>
																	<div data-v-2be690e6=""><label
																			data-v-2be690e6="">交付方式：</label><span
																			data-v-2be690e6="">{{listData.F_DeliveryMethod}}</span></div>
																	<!-- <div class="clicks" data-v-2be690e6=""> 点击次数：17
																	</div> -->
																</div>
															</div>
														</div>
													</div>
													<div class="detailPrice__buy" data-v-2be690e6="">
														
															<button class="el-button el-button--primary is-round"
																aria-disabled="false" type="button" data-v-2be690e6=""
																style="width: 182px; height: 40px;"  @click="tohref2()">
																<span class="">立即试用</span>
															</button>
														
														
														<!-- <button class="el-button is-round" aria-disabled="false"
															type="button" data-v-2be690e6=""
															style="width: 182px; height: 40px;color: #000000;">
															<span class="">立即试用</span>
														</button> -->
													</div>
												</div>
											</div>
										</div>
										<!-- 中 -->
										<div class="el-tabs el-tabs--top demo-tabs" data-v-2be690e6="" style="height: 100%;">
										<el-tabs v-model="activeName" type="card" @tab-click="handleClick">
										    <el-tab-pane label="组件基础信息" name="first">
												<div class="el-descriptions" data-v-2be690e6="">
														<!--v-if-->
														<div class="el-descriptions__body">
															<table class="el-descriptions__table">
																<tbody>
																	<tr>
																		<td class="el-descriptions__cell"><span
																				class="el-descriptions__label">组件名称</span><span
																				class="el-descriptions__content">{{listData.F_Name}}</span>
																		</td>
																	</tr>
																	<tr>
																		<td class="el-descriptions__cell"><span
																				class="el-descriptions__label">组件类型</span><span
																				class="el-descriptions__content">{{listData.F_Type}}</span>
																		</td>
																	</tr>
																	<tr>
																		<td class="el-descriptions__cell"><span
																				class="el-descriptions__label">应用场景</span><span
																				class="el-descriptions__content">{{listData.F_ApplicationScenario}}</span>
																		</td>
																	</tr>
																	<tr>
																		<td class="el-descriptions__cell"><span
																				class="el-descriptions__label">交付方式</span><span
																				class="el-descriptions__content">{{listData.F_DeliveryMethod}}</span>
																		</td>
																	</tr>
																	<tr>
																		<td class="el-descriptions__cell"><span
																				class="el-descriptions__label">组件版本</span><span
																				class="el-descriptions__content">{{listData.F_Versions}}</span>
																		</td>
																	</tr>
																	<tr>
																		<td class="el-descriptions__cell"><span
																				class="el-descriptions__label">组件使用要求</span><span
																				class="el-descriptions__content">{{listData.F_UseRequirement}}</span>
																		</td>
																	</tr>
																	<tr>
																		<td class="el-descriptions__cell">
																			<span class="el-descriptions__label">使用链接</span>
																				<span class="el-descriptions__content">
																					
																					<button class="el-button el-button--primary is-link"
																					aria-disabled="false" type="button"  @click="tohref2()"
																					data-v-2be690e6="">
																					<span class="">立即试用</span>
																					</button>	
																					
																				</span>
																		</td>
																	</tr>
																	<tr>
																		<td class="el-descriptions__cell" colspan="1">
																			<span
																				class="el-descriptions__label">组件简介</span><span
																				class="el-descriptions__content">{{listData.F_BriefIntroduction}}</span>
																		</td>
																	</tr>
																</tbody>
															</table>
														</div>
													</div>
													</el-tab-pane>
										    <el-tab-pane label="配置管理" name="second">
												<div data-v-20cf07ec="" class="basic-detail" data-v-2be690e6="">
													<div data-v-20cf07ec="" class="el-col" data-v-2be690e6=""><span
															data-v-20cf07ec="" class="scenarioDetail-subTitle"
															data-v-2be690e6="">目标用户群体</span></div>
													<div data-v-20cf07ec="" class="scenarioDetail-subContent"
														data-v-2be690e6="">{{listData.F_TargetUser}}</div>
													<div data-v-20cf07ec="" class="el-col" data-v-2be690e6=""><span
															data-v-20cf07ec="" class="scenarioDetail-subTitle"
															data-v-2be690e6="">解决痛点</span></div>
													<div data-v-20cf07ec="" class="scenarioDetail-subContent"
														data-v-2be690e6="">{{listData.F_PainPoints}}</div>
													<div data-v-20cf07ec="" class="el-col" data-v-2be690e6=""><span
															data-v-20cf07ec="" class="scenarioDetail-subTitle"
															data-v-2be690e6="">成功案例</span></div>
													<div data-v-20cf07ec="" class="scenarioDetail-subContent"
														data-v-2be690e6="">{{listData.F_SuccessfulCase}}</div>
													<div data-v-20cf07ec="" class="el-col" data-v-2be690e6=""><span
															data-v-20cf07ec="" class="scenarioDetail-subTitle"
															data-v-2be690e6="">常见问题</span></div>
													<div data-v-20cf07ec="" class="scenarioDetail-subContent"
														data-v-2be690e6="">{{listData.F_CommonProblem}}</div>
												</div>
											</el-tab-pane>
										    <el-tab-pane label="编程指南" name="third">
												<div class="el-descriptions__body">
															<table class="el-descriptions__table">
																<tbody>
																	<tr>
																		<td class="el-descriptions__cell"><span
																				class="el-descriptions__label">编程指南概述</span><span
																				class="el-descriptions__content"></span>
																		</td>
																	</tr>
																	<tr>
																		<td class="el-descriptions__cell" colspan="1">
																			<span
																				class="el-descriptions__label">编程指南文档附件</span><span
																				class="el-descriptions__content"></span>
																		</td>
																	</tr>
																</tbody>
															</table>
														</div>
														</el-tab-pane>
										    <el-tab-pane label="测试报告" name="fourth">
												<div class="el-descriptions__body">
													<table class="el-descriptions__table">
														<tbody>
															<tr>
																<td class="el-descriptions__cell"><span
																		class="el-descriptions__label">性能测试报告</span><span
																		class="el-descriptions__content"></span>
																</td>
															</tr>
															<tr>
																<td class="el-descriptions__cell" colspan="1">
																	<span
																		class="el-descriptions__label">功能测试报告</span><span
																		class="el-descriptions__content"></span>
																</td>
															</tr>
														</tbody>
													</table>
												</div>
															</el-tab-pane>
											<el-tab-pane label="用户评价" name="fiveth"><span data-v-2be690e6="">暂无</span></el-tab-pane>
										  </el-tabs>
										</div>										
									</div>
									<div class="right-contain" data-v-2be690e6="" style="width: 295px;">
										<div class="info" data-v-dd9e0b9e="" data-v-2be690e6="">
											<div class="el-descriptions desc" data-v-dd9e0b9e="">
												<!--v-if-->
												<div class="el-descriptions__body">
													<table class="el-descriptions__table">
														<tbody>
															<tr>
																<td class="el-descriptions__cell"><span
																		class="el-descriptions__label">服务商</span><span
																		class="el-descriptions__content"><span
																			class="enterpriseName"
																			data-v-dd9e0b9e="">{{listData.F_ServiceProvider}}</span></span>
																</td>
															</tr>
															<tr>
																<td class="el-descriptions__cell"><span
																		class="el-descriptions__label">联系人</span><span
																		class="el-descriptions__content">{{listData.F_publishUserName}}</span></td>
															</tr>
															<tr>
																<td class="el-descriptions__cell"><span
																		class="el-descriptions__label">电话</span><span
																		class="el-descriptions__content">{{listData.F_publishPhone}}</span></td>
															</tr>
															<tr>
																<td class="el-descriptions__cell"><span
																		class="el-descriptions__label">邮箱</span><span
																		class="el-descriptions__content">{{listData.F_ServiceEmail}}</span>
																</td>
															</tr>
															<tr>
																<td class="el-descriptions__cell" colspan="1"><span
																		class="el-descriptions__label">问题处理</span><span
																		class="el-descriptions__content"><button
																			class="el-button" aria-disabled="false"
																			type="button" data-v-dd9e0b9e="" style="color: #333;border-radius: 20px;border: 1px solid #999;">
																			<!--v-if--><span class="">提交工单</span>
																		</button></span></td>
															</tr>
														</tbody>
													</table>
												</div>
											</div>
										</div>

									</div>
								</div>
							</div>
						</div>
						<div class="el-overlay" style="z-index: 2003; display: none;">
							<div role="dialog" aria-modal="true" aria-labelledby="el-id-5536-8"
								aria-describedby="el-id-5536-9" class="el-overlay-dialog"></div>
						</div>
					</div>
				</div>
				<!-- <div class="footer-wrap" data-v-efc81599="" data-v-9a867d3b="">
					<div class="contain" data-v-efc81599="">
						<div class="unit" data-v-efc81599=""><span data-v-efc81599="">指导单位：</span><span
								data-v-efc81599="">浙江省经济和信息化厅</span></div>
						<div class="company" data-v-efc81599=""><span data-v-efc81599="">建设单位：</span><span
								data-v-efc81599="">浙江省产业大数据有限公司</span></div>
					</div>
					<div class="record" data-v-efc81599=""><span data-v-efc81599="">浙ICP备2022019283号-1</span></div>
				</div> -->
			</div>
		</div>
	</body>
</template>

<script>
	import {
		getIndexPages,
		changeIndexSetting,
		getIndexDefaultConf
	} from '@/api/organization/user';
	import request from "@/router/axios";
	import {
		mapGetters
	} from "vuex";
	import {
		baseUrl
	} from "@/config/env";
	export default {
		name: 'XiangQing',
		//使用props配置项接受参数
		props: ['F_Id'],
		data() {
			return {
				id: '',
				listData: [],
				activeName: 'first',
				F_Account:'',
				F_Url:'',
				F_UserType:'',
				isdisabled:true,
			}
		},
		mounted() {
			this.getListData();
			this.tohref();
			this.F_UserType = localStorage.getItem('F_UserType');
			console.log(this.F_UserType)
			// this.id = this.$route.query.F_Id;
		},
		created() {
			this.id = this.$route.query.F_Id;
			// this.getListData();
		},
		methods: {
			tohref(){
				this.F_Account = localStorage.getItem('F_Account')
				console.log(this.F_Account)
			},
			tohref2(){
				if(!this.F_Url){
					this.isdisabled = false
					this.$notify({
					  title: "失败",
					  message: "请先登录",
					  type: "warning",
					});
				}
				else{
					if(this.F_UserType == 0 || this.F_UserType == 1){
						request({
						  url: baseUrl + "/business_opportunity?assemblyId=" + this.listData.F_Name,
						  method: "post",
						  // data : newObj
						}).then((res) => {						  
						    window.open(this.F_Url, '_blank')
						});
						
					}
					else{
						this.$notify({
						  title: "失败",
						  message: "只有服务商与买家才可试用",
						  type: "warning",
						});
					}
				}
			},
			getListData() {
				axios({
						url: baseUrl + '/barinfunctionalsubassembly/mainInfo?id=' + this.id,
						method: 'get',
					}).then(res => {
						this.listData = res.data.data;
						this.listData.F_Icon = baseUrl + res.data.data.F_Icon;
                        if(this.F_Account == 'undefined'){
							this.F_Url = '';
							
						}
						else{
							this.F_Url = this.listData.F_Url;
						}
						console.log(this.F_Url)
					})
					.catch(error => {
						console.error('数据异常!', error);
					});
			},
			handleClick(tab, event) {
			        console.log(tab, event);
			      },
		},


	}
</script>

<style>
	#app {
	    width: 100%;
	    height: 100%;
	}
	html, body, #app {
	    height: 1100px;
	    margin: 0;
	    padding: 0;
	}
	.body[data-v-14a057b8] {
		box-sizing: border-box;
		cursor: pointer;
	}

	.body .content[data-v-14a057b8] {
		display: flex;
		align-items: center;
		justify-content: space-between
	}

	.body .content .title[data-v-14a057b8] {
		width: 320px;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
		line-height: 32px;
		height: 32px;
		font-weight: 400;
		font-size: 16px;
		color: #363a44
	}

	.body .content .btn[data-v-14a057b8] {
		display: none;
		width: 80px;
		height: 20px;
		line-height: 20px;
		border: 1px solid #b3b5b9;
		border-radius: 25px;
		text-align: center;
		font-weight: 400;
		font-size: 14px;
		color: #686b73
	}

	.body .info .time[data-v-14a057b8] {
		font-weight: 400;
		font-size: 14px;
		color: #b3b5b9
	}

	.body:hover .btn[data-v-14a057b8] {
		display: block
	}

	.common-layout[data-v-9a867d3b] {
		position: relative;
		background: #f6f8fb;
		overflow: hidden;
		height: 100%;
	}

	.common-layout .main-container[data-v-9a867d3b] {
		width: 100%;
		position: relative;
	}

	.common-layout .main-container .container[data-v-9a867d3b] {
		background-color: #f1f2f4; 
		border-radius: 6px;
	}

	.wrapper[data-v-2be690e6] {
		width: 100%;
		min-height: 100%;
		box-sizing: border-box;
		background-color: #f6f8fb;
	}

	.main-contain[data-v-2be690e6] {
		width: 1200px;
		margin: 0 auto;
	}

	.main-contain .breadcrumb[data-v-2be690e6] {
		padding: 20px;
	}

	.search-condition[data-v-2be690e6] {
		display: flex;
		justify-content: space-between;
	}

	.detailHeader[data-v-2be690e6] {
		border: 1px solid #ebebeb;
		padding: 20px;
		background-color: #fff;
	}

	.detailHeader__header[data-v-2be690e6] {
		padding: 35px 20px 0;
		display: flex;
		flex-wrap: nowrap;
		position: relative;
		box-sizing: border-box;
	}

	.detailHeader__header .detailHeader__img[data-v-2be690e6] {
		width: 120px;
		height: 120px;
		border: 1px solid #e1e2e6;
		border-radius: 4px;
		overflow: hidden;
		margin-right: 40px;
		display: flex;
		align-items: center;
	}

	.el-image {
		position: relative;
		display: inline-block;
		overflow: hidden;
	}

	.el-image__inner {
		vertical-align: top;
		opacity: 1;
	}

	.detailHeader__header .clearfix[data-v-2be690e6] {
		zoom: 1;
	}

	.detailHeader__header .detailHeader__overview[data-v-2be690e6] {
		max-width: 80%;
		display: flex;
		flex-direction: column;
	}

	.detailHeader__header .detailHeader__overview .detailHeader__text[data-v-2be690e6] {
		display: flex;
		flex-direction: column;
	}

	.detailHeader__header .detailHeader__overview .detailHeader__text .detailHeader__title[data-v-2be690e6] {
		display: flex;
		justify-content: space-between;
	}

	.detailHeader__header .detailHeader__overview .detailHeader__text .detailHeader__title .detailHeader__titleText[data-v-2be690e6] {
		width: 600px;
	}

	.detailHeader__header .version[data-v-2be690e6] {
		font-weight: 400;
		color: #999;
		margin-left: 10px;
	}

	.detailHeader__header .tags[data-v-2be690e6] {
		display: flex;
		align-items: center;
		margin-top: 24px;
	}

	.detailHeader__header .tags .tag[data-v-2be690e6] {
		margin-right: 8px;
		padding: 3px;
		border: 1px solid #ccc;
		color: #999;
		font-size: 14px;
	}

	.detailHeader__header .detailHeader__overview .detailHeader__text .detailHeader__digest[data-v-2be690e6] {
		opacity: .8;
		font-family: PingFangSC-Regular;
		font-size: 14px;
		color: #474964;
		line-height: 24px;
		margin: 10px 0;
	}

	.detailHeader__header .detailPrice__pricePart[data-v-2be690e6] {
		line-height: 22px;
		width: 639px;
		height: 120px;
		margin: 20px 0 16px;
		background: #f5f8ff;
		border-radius: 4px;
		display: flex;
		justify-content: center;
		flex-direction: column;
		background-image: url(/image/details.png) no-repeat;
		background-size: cover;
		padding: 20px 0;
	}

	.detailHeader__header .detailPrice__pricePart label[data-v-2be690e6] {
		font-family: PingFangSC-Regular;
		font-size: 14px;
		height: 20px;
		font-weight: 400;
		color: #686b73;
		text-align: center;
		padding-left: 20px;
	}

	.detailHeader__header .detailPrice__pricePart .detailPrice__priceCny[data-v-2be690e6] {
		font-family: RobotoMono-Regular;
		font-size: 14px;
		color: #ff5159;
		letter-spacing: -1px;
		text-align: left;
	}

	.detailHeader__header .detailPrice__pricePart .detailPrice__priceNum[data-v-2be690e6] {
		font-family: RobotoMono-Medium;
		font-size: 28px;
		color: #ff5159;
		letter-spacing: -2px;
		text-align: left;
		padding: 0 1px 0 4px;
		line-height: 20px;
	}

	.detailHeader__header .detailPrice__pricePart label.market[data-v-2be690e6] {
		font-size: 14px;
		margin-left: 16px;
		color: #b3b5b9;
	}

	.detailHeader__header .detailPrice__pricePart label[data-v-2be690e6] {
		font-family: PingFangSC-Regular;
		font-size: 14px;
		height: 20px;
		font-weight: 400;
		color: #686b73;
		text-align: center;
		padding-left: 20px;
	}

	.detailHeader__header .detailPrice__pricePart span.market-price[data-v-2be690e6] {
		font-size: 14px;
		color: #b3b5b9;
		text-decoration: line-through;
	}

	.average[data-v-4f3f1118] {
		display: flex;
		padding: 20px;
		border-radius: 6px;
		background-color: #f4f8ff;
	}

	.average .unit[data-v-4f3f1118] {
		font-family: PingFangSC-Medium;
		font-weight: 500;
		font-size: 16px;
		color: #686b73;
		line-height: 32px;
	}

	.average .score[data-v-4f3f1118] {
		font-family: PingFangSC-Medium;
		font-weight: 500;
		font-size: 22px;
		line-height: 30px;
		color: #2d70f8;
		margin-right: 4px;
		margin-left: 10px;
	}

	.detailHeader__header .detailPrice__pricePart label[data-v-2be690e6] {
		font-family: PingFangSC-Regular;
		font-size: 14px;
		height: 20px;
		font-weight: 400;
		color: #686b73;
		text-align: center;
		padding-left: 20px;
	}

	.detailHeader__header .clicks[data-v-2be690e6] {
		display: flex;
		align-items: center;
		justify-content: flex-end;
		color: #999;
		font-size: 14px;
		margin-right: 10px;
	}

	.detailHeader__header .detailPrice__buy[data-v-2be690e6] {
		margin: 20px 0;
	}
	.demo-tabs[data-v-2be690e6] {
		background-color: #fff;
		padding: 20px 0;
		margin: 20px 0;
	}

	.el-tabs {
		--el-tabs-header-height: 40px;
		height: 100%;
	}

	.el-tabs__header {
		padding: 0;
		position: relative;
		margin: 0 0 15px;
	}

	.el-tabs__nav-wrap {
		overflow: hidden;
		margin-bottom: -1px;
		position: relative;
	}

	.el-tabs__nav-scroll {
		overflow: hidden;
	}

	.el-tabs__nav {
		display: flex;
		white-space: nowrap;
		position: relative;
		transition: transform var(--el-transition-duration);
		float: left;
		z-index: calc(var(--el-index-normal) + 1);
	}

	.el-tabs__active-bar {
		position: absolute;
		bottom: 0;
		left: 0;
		height: 2px;
		background-color: var(--el-color-primary);
		z-index: 1;
		transition: width var(--el-transition-duration) var(--el-transition-function-ease-in-out-bezier), transform var(--el-transition-duration) var(--el-transition-function-ease-in-out-bezier);
		list-style: none;
	}

	.demo-tabs[data-v-2be690e6] .el-tabs__item {
		padding-left: 32px !important;
	}

	.el-tabs__item {
		padding: 0 20px;
		height: var(--el-tabs-header-height);
		box-sizing: border-box;
		display: flex;
		align-items: center;
		justify-content: center;
		list-style: none;
		font-size: var(--el-font-size-base);
		font-weight: 500;
		color: var(--el-text-color-primary);
		position: relative;
	}

	.el-tabs__item.is-active {
		color: var(--el-color-primary);
	}

	.demo-tabs[data-v-2be690e6] .el-tabs__content {
		padding: 32px;
		height: 100%;
	}

	.el-tabs__content {
		overflow: hidden;
		position: relative;
		height: 100%;
	}

	.el-descriptions {
		--el-descriptions-table-border: 1px solid var(--el-border-color-lighter);
		--el-descriptions-item-bordered-label-background: var(--el-fill-color-light);
		box-sizing: border-box;
		font-size: var(--el-font-size-base);
		color: var(--el-text-color-primary);
	}

	.el-descriptions__body {
		background-color: var(--el-fill-color-blank);
	}

	.el-descriptions__body .el-descriptions__table {
		border-collapse: collapse;
		width: 100%;
	}

	table {
		border-collapse: collapse;
		border-spacing: 0;
	}

	.el-descriptions__body .el-descriptions__table:not(.is-bordered) .el-descriptions__cell {
		padding-bottom: 12px;
	}

	.el-descriptions__body .el-descriptions__table .el-descriptions__cell {
		box-sizing: border-box;
		text-align: left;
		font-weight: 400;
		line-height: 23px;
		font-size: 14px;
	}

	.basic-detail .el-col[data-v-2be690e6] {
		line-height: 48px;
		font-size: 16px;
		font-family: PingFangSC-Regular, PingFang SC;
		font-weight: 400;
		color: #333;
	}

	.basic-detail .scenarioDetail-subTitle[data-v-2be690e6] {
		display: block;
		height: 50px;
		line-height: 50px;
		background-image: linear-gradient(90deg, #1d64cc, #fff);
		padding-left: 10px;
		color: #fff;
		margin: 10px 0;
	}

	.basic-detail .scenarioDetail-subContent[data-v-2be690e6] {
		padding: 0 0 30px 10px;
	}

	.info[data-v-dd9e0b9e] {
		text-align: center;
		padding: 20px 0 0;
		margin: 0 0 24px;
		background-color: #fff;
	}

	.info .desc[data-v-dd9e0b9e] {
		padding-left: 24px;
		margin: 0 auto;
	}

	.el-descriptions {
		--el-descriptions-table-border: 1px solid var(--el-border-color-lighter);
		--el-descriptions-item-bordered-label-background: var(--el-fill-color-light);
		box-sizing: border-box;
		font-size: var(--el-font-size-base);
		color: var(--el-text-color-primary);
	}

	.el-descriptions__body {
		background-color: var(--el-fill-color-blank);
	}

	.el-descriptions__body .el-descriptions__table {
		border-collapse: collapse;
		width: 100%;
	}
	.el-descriptions__label:not(.is-bordered-label) {
	    color: var(--el-text-color-primary);
	    margin-right: 16px;
	}
	.el-descriptions__content:not(.is-bordered-label) {
	    color: var(--el-text-color-regular);
	}

	table {
		border-collapse: collapse;
		border-spacing: 0;
	}
</style>
